<template>
	<view class="an-user-list">
		<uni-list>
			<uni-swipe-action v-for="item in userList" 
			:key="item.id" 
			:options="isDisabled(item.grade)" 
			@click="bindClick" 
			@change="bindOpened(item)">
				<uni-list-item :show-arrow="false" 
				:title="item.name" 
				:showBadge="item.grade != 1" 
				:badgeType="item.grade == 3?'error':'success'"
				:badgeText="item.grade == 3?'超级管理员':'管理员'"/>
			</uni-swipe-action>
		</uni-list>
		<an-loading style="margin-top: 40px;" v-if="loading"></an-loading>
	</view>
</template>

<script>
	import uniSwipeAction from '@/components/uni-swipe-action/uni-swipe-action.vue'
	import uniList from '@/components/uni-list/uni-list.vue'
	import uniListItem from '@/components/uni-list-item/uni-list-item.vue'
	import anLoading from "@/components/an-loading.vue"
	import {mapState} from 'vuex'
	export default {
		computed: {
		    ...mapState(['userInfo'])
		},
		components: {
			uniSwipeAction,
			uniList,
			uniListItem,
			anLoading
		},
		data() {
			return {
				loading: false,
				postData:{
					page:1,
					pageSize: 10
				},
				options: [{
					text: '修改',
					style: {
						backgroundColor: '#007aff'
					}
				}, {
					text: '删除',
					style: {
						backgroundColor: '#dd524d'
					}
				}],
				userList:[],
				total:0,
				activeItem:{}, // 操作中的用户信息
			}
		},
		onLoad(){
			this.getList()
		},
		onNavigationBarButtonTap(obj){	// 页面元素 右上角按钮触发
			uni.navigateTo({
				url: '../user/userAdd'
			});
		},
		methods: {
			
			getList(){
				this.loading = true
				this.$api.getAllUser(this.postData).then(res=>{
					this.loading = false
					this.userList = res.list
					this.total = res.total
				})
			},
			bindClick(value) {
				if(value.content.text === '删除'){
					this.deleteUser()
				}else if(value.content.text === '修改'){
					this.editUser()
				}
			},
			editUser(){	// 修改
				let od = this.activeItem
				let detail = {
					email: od.email,
					grade: od.grade,
					id: od.id,
					name: od.name
				}
				console.log(od)
				uni.navigateTo({
					url: "../user/userAdd?detailDate=" + encodeURIComponent(JSON.stringify(detail))
				})
			},
			deleteUser(){	// 删除
				if(this.activeItem.grade == 3){	// 超级管理员
					return uni.showToast({title: `超级管理员不能删除`,icon: 'none'})
				}
				let nd = {
					ids:this.activeItem.id
				}
				this.$api.deleteUser(nd).then(()=>{
					uni.showToast({title: `操作成功!`})
					this.getList()
				})
			},
			bindOpened(item){	// 打开滑块触发
				this.activeItem = item
			},
			isDisabled(grade){	// 滑块是否禁止
				let arry = this.options
				if(this.userInfo.grade == 3){	// 超级管理员
					if(grade == 3){	// 不能修改 超级管理员
						return []
					}else{
						return arry
					}
				}else if(this.userInfo.grade == 2){	// 普通管理员
					if(grade == 2 || grade == 3){	// 不能修改 超级管理员和管理员
						return []
					}else{
						return arry
					}
				}else{	// 普通用户 禁止滑动
					return []
				}
			}
			
		}
	}
</script>

<style>
</style>
